<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>mqtt-demo</title>
    <script src="http://47.108.233.67/demo/mqttws31.js" type="text/javascript"></script>
    <script>
        function onConnectionLost(responseObject) {
            console.log(responseObject);
            s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", onConnectionLost()}";
            console.log(s);
            if (responseObject.errorCode !== 0) {
                console.log("onConnectionLost:" + responseObject.errorMessage);
                console.log("connect is lost");
            }
        }

        function onMessageArrived(message) {
            s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", onMessageArrived()}";
            console.log(s);
			console.log(JSON.stringify(message));
            console.log("reciv:" + message.destinationName);
			console.log("reciv:" + message.payloadString);
			console.log("qos->"+message.qos)


			var contenEle=document.getElementById("content");
			
			contenEle.append(message.payloadString);
			
			contenEle.appendChild(document.createElement("br"));
			
        }
		
		
        var hostname = '47.108.233.67', //'192.168.1.2',
            port = 8007,
            clientId = 'user1',
            timeout = 5,
            keepAlive = 5,
            cleanSession = true,
            ssl = false,
            userName = 'cus_9',  
            password = 'user123456',  

			chattocpic = "/root/one2one/chat/cus_9";

        client = new Paho.MQTT.Client(hostname, port, clientId);

        var options = {
            invocationContext: {
                host: hostname,
                port: port,
                path: client.path,
                clientId: clientId
            },
            timeout: timeout,
            keepAliveInterval: keepAlive,
            cleanSession: cleanSession,
			
            useSSL: ssl,
           userName :'cus_9',  
            password : 'user123456', 
            onSuccess: onConnect,
            onFailure: function (e) {
                console.log(e);
                s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", onFailure()}";
                console.log(s);
            }
			
        };
       
	  client.connect(options);

        function onConnect() {
            console.log("onConnected");
            s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", onConnected()}";
            console.log(s);
            //client.subscribe(topic,0);
        }

        client.onConnectionLost = onConnectionLost;


        client.onMessageArrived = onMessageArrived;

       

        function send() {
          var vacontent =  {
			salerAvatar: "https://sixeco-neco.oss-cn-shanghai.aliyuncs.com/init/rs5AgentAvatar.png",
			salerName: "hktest",
			content: "this is test",
			createTime: 1588757484258,
			createTimeStr: "2020-05-06 17:31:24",
			fromUser: "cus_9",
			id: "123",
			toUser: "sale_1",
			type: "text",
			userAvatar: "https://baojunev-mall.oss-cn-shenzhen.aliyuncs.com/20180829111535-165d6f63b398451491ec765ba70896c0.png",
			userName: "tianzhenjiu",
		}
            if (vacontent) {
               // s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", content:" + (s) + ", from: web console}";
				
				s=JSON.stringify(vacontent);
                message = new Paho.MQTT.Message(s);
                message.destinationName = chattocpic;
				message.duplicate=true;
				message.qos=2;
                client.send(message);
				
				console.log(s);
            }
        }

        var count = 0;
        Date.prototype.Format = function (fmt) { //author: meizz 
            var o = {
                "M+": this.getMonth() + 1,
                "d+": this.getDate(), //
                "h+": this.getHours(), //
                "m+": this.getMinutes(), //
                "s+": this.getSeconds(), //
                "q+": Math.floor((this.getMonth() + 3) / 3), //
                "S": this.getMilliseconds() //
            };
            if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
            for (var k in o)
                if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[
                    k]) : (("00" + o[k]).substr(("" + o[k]).length)));
            return fmt;
        }
	function send(){
	
			var  inputText=document.getElementById("inputText");
			
			var text=inputText.value;
					message = new Paho.MQTT.Message(text);
                    message.destinationName =chattocpic;

				client.send(message);
	}
</script>
</head>
<body>
<input type="button" value="publishMsg" onclick="send()" />
<textarea id="inputText">
</textarea>


<div id="content">
</div>
</body>

</html>